<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ระบบบริหารการจองโต๊ะอาหาร</title>

<link href="css/table_status.css" rel="stylesheet" type="text/css" />
<link href="css/popup_register.css" rel="stylesheet" type="text/css" />
<link href="css/calender.css" rel="stylesheet" type="text/css" />
<script src="../inc/ajax_framework.js"></script>
<script src="js/status.js"></script>
<script src="js/register.js"></script>
<script type="text/javascript" src="../inc/jquery.js"></script>
<script type="text/javascript" src="js/calendar/jquery-ui.js"></script>
<script type="text/javascript" src="js/calendar/jquery-ui-timepicker-addon.js"></script>
</head>
<body>

<script type="text/javascript">

	$(function(){
		$('.mainForm > pre').each(function(i){
			eval($(this).text());
		});
	});
	
</script>

<p id="backToIndexPage"><a href="../">Back</a></p>

<center>
<div class="mainForm">
<form name="formSearchStatus"><span id="headTitle">ระบบจองโต๊ะอาหารล่วงหน้า</span><br>
<br><br><br>
<label>วันและเวลาที่ต้องการจอง&nbsp; 
	<input id="dete_start" name="dete_start" type="text" name="dete_start" value="" size="20" readonly="readonly">
</label>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 

<label>ถึง&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
	<input id="dete_end" name="dete_end" type="text" name="dete_end" value="" size="20" readonly="readonly"> 
</label> 

<label>
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
	<a href="#"> 
		<input type="button" id="button_search" class="button" name="submit" 
		onclick="checkStatus()" value="ค้นหา"> 
	</a>
</label>

</form>
<pre id="1" class="calendar_h">
	var begin = $('#dete_start');
	
	begin.datetimepicker({
		hourMin: 10,
		hourMax: 20,
		showSecond: false,
		timeFormat: 'hh:mm',
		stepHour: 1,
		stepMinute: 15,
		minDate: new Date(new Date())
	});
</pre>
<pre id="2" class="calendar_h">
	var dateStartValue = document.getElementById('dete_start').value;
	var end = $('#dete_end');
	end.datetimepicker({
		hourMin: 10,
		hourMax: 20,
		showSecond: false,
		timeFormat: 'hh:mm',
		stepHour: 1,
		stepMinute: 15,
		minDate: new Date(new Date())
	});
</pre>

</div>
</center>
<br>
<center>

<span id="indicator">
	<img src="pic/load.gif" hspace="10">&nbsp;<b>Now loading...</b>
</span>

<div id="show_status"></div>
</center>

<!-- ============== เริ่มต้น popup ของหน้าลงชื่อจอง  =============== -->

<div id="popup_register" class="popup_block">
<div id="register" class="form">
<form id="form" name="form" method="post" action="index.html">
<h1>ลงทะเบียนจองโต๊ะอาหาร</h1>

<label>ชื่อผู้จอง </label> 
	<input type="text" id="name" /> 
<label>นามสกุล</label>
	<input type="text" id="lastName" /> 
<label>เบอร์โทรศัพท์</label> 
	<input type="text" id="phone" /> 
<label>อีเมล์</label> 
	<input type="text" id="email" /> 
<label>วันและเวลาที่เริ่มจอง </label> 
	<input type="text" id="timeStart" readonly="readonly" style="text-align: center; size: 22;" /> 
<label>จองถึง </label> 
	<input type="text" id="timeEnd" readonly="readonly" style="text-align: center; size: 22;"/>
<label>จำนวนผู้มารัปทานอาหาร</label> 
	<select id=countPeople>
		<option value=1> 1 </option>
		<option value=2> 2 </option>
		<option value=3> 3 </option>
		<option value=4> 4 </option>
		<option value=5> 5 </option>
		<option value=6> 6 </option>
	</select>
<br><br><br>
<button type="button" onclick="registerSubmit()">จอง</button>
<input type="hidden" id="finalStart" value="" />
<input type="hidden" id="finalEnd" value="" />
<input type="hidden" id="finalTable_num" value="" />
<div class="spacer"></div>

</form>
</div>
</div>

</body>
</html>